<template>
  <div class="home">
    <h2>counter页面</h2>
    <h2>当前计数：{{ count }}</h2>
    <button @click="add">+1</button>
  </div>
</template>

<script setup>
import { storeToRefs } from 'pinia'
import { toRefs } from 'vue'
import useCounter from '@/stores/counter'

const counterStore = useCounter()
//不是响应式
// const {count}=counterStore
//1、toRefs
// const {count}=toRefs(counterStore)

//2、pinia提供的storeToRefs
const { count } = storeToRefs(counterStore)

function add() {
  counterStore.count++
}
</script>

<style scoped></style>
